<template>
  <div>
    <div>
      <el-form :inline="true" :model="medicalCard" class="demo-form-inline">
        <el-form-item>
          <el-input style="width: 300px" prefix-icon="el-icon-search" placeholder="请输入就诊卡号" v-model="medicalCard.id"></el-input>
        </el-form-item>
        <el-select v-model="payStatus" placeholder="请选择">
          <el-option
              v-for="item in value1"
              :key="item.value"
              :label="item.label"
              :value="item.value">
          </el-option>
        </el-select>
        <el-form-item>
          <el-button type="primary" @click="getRecordByMid">查询</el-button>
        </el-form-item><br>
      </el-form>
    </div>
    <el-table
        :data="prescription"
        style="width: 100%"
        height="500">
      <el-table-column
          prop="id"
          fixed
          label="处方号"
          width="150">
      </el-table-column>
      <el-table-column
          prop="medicalCard.name"
          label="患者"
          width="150">
      </el-table-column>
      <el-table-column
          prop="medicalCard.sex"
          label="性别"
          width="150">
      </el-table-column>
      <el-table-column
          prop="user.name"
          label="医生"
          width="150">
      </el-table-column>
      <el-table-column
          prop="department.name"
          label="科室"
          width="150">
      </el-table-column>
      <el-table-column
          prop="totalPrice"
          label="应付金额"
          width="150">
      </el-table-column>
      <el-table-column
          prop="revPrice"
          label="实付金额"
          width="150">
      </el-table-column>
      <el-table-column
          prop="backPrice"
          label="找回金额"
          width="150">
      </el-table-column>
      <el-table-column
          prop="payTime"
          label="缴费时间"
          width="250">
      </el-table-column>
      <el-table-column prop="payStatus" label="处方缴费状态" width="120" fixed="right">
        <template #default="scope">
          <el-tag v-if="scope.row.payStatus" type="success">已缴费</el-tag>
          <el-tag v-else type="danger">未缴费</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="takeStatus" label="取药状态" width="120" fixed="right">
        <template #default="scope">
          <el-tag v-if="scope.row.takeStatus" type="success">已取药</el-tag>
          <el-tag v-else type="danger">未取药</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="backStatus" label="退药状态" width="120" fixed="right">
        <template #default="scope">
          <el-tag v-if="!scope.row.backStatus" type="success">未退药</el-tag>
          <el-tag v-else type="danger">已退药</el-tag>
        </template>
      </el-table-column>
      <el-table-column
          fixed="right"
          label="操作"
          width="150">
        <template slot-scope="scope">
          <el-button type="danger" size="small" class="el-button--danger" @click="handleDelete(scope.$index, scope.row)">退药</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: "ChargeRecord",
  data(){
    return{
      payStatus:'',
      value1:[
        {
          label:'未收费',
          value:false
        },
        {
          label:'已收费',
          value:true
        }
      ],
      prescription:[
        {
          user:'',
          department:'',
          medicalCard:'',
          outpatients:''
        }
      ],

      user:{
        name:'',
      },
      department:{
        name:''
      },
      medicalCard: {
        id:'',
        name:'',
        sex:'',
        telephone:'',
        idCard:'',
        email:''
      },
      outpatients:{
        id:'',
        mid:'',
        diagnosis:'',
        chiefComplaint:'',
        advice:'',
        uid:'',
        preId:'',
        tid:'',
        rid:'',
        enabled:''
      },
    }
  },
  methods:{
    //获取患者处方信息
    getRecordByMid(){
      this.getRequest('/charge/getMes?mid='+this.medicalCard.id+'&payStatus='+this.payStatus).then(resp=>{
        if(resp){
          console.log(resp)
          this.prescription=resp;
        }
      })
    },
    //退药
    handleDelete(index,data) {
      this.$confirm('是否继续进行退药操作, '+'应退还金额'+data.totalPrice+'元,是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.getRequest('/charge/backDrugs?id='+data.id).then(resp=>{
          if(resp){
            this.getRecordByMid();

          }
        })


      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消退药'
        });
      });
    },
  }
}
</script>

<style scoped>

</style>